import React, { ReactNode } from "react";

type Props = {
  custom?: boolean;
  first?: boolean;
  last?: boolean;
  children: ReactNode;
};

const SectionTitle = ({
  custom = false,
  first = false,
  last = false,
  children,
}: Props) => {
  let classAddon = "-my-6";

  if (first) {
    classAddon = "-mb-6";
  } else if (last) {
    classAddon = "-mt-6";
  }

  return (
    <section
      className={`py-24 px-6 lg:px-0 lg:max-w-2xl lg:mx-auto text-center ${classAddon}`}
    >
      {custom && children}
      {!custom && (
        <h1 className="text-2xl text-gray-500 dark:text-slate-400">
          {children}
        </h1>
      )}
    </section>
  );
};

export default SectionTitle;
